<template>
  <div>
    <div class="buttonGroup">
      <el-button v-if="form.id && !disabled" @click="update">更 新</el-button>
      <template v-if="!form.id">
        <el-button @click="save(false)">保 存</el-button>
        <!-- <el-button type="primary" :icon="Plus" @click="save(true)"
          >保存并新增</el-button
        > -->
      </template>
      <el-button type="info" :icon="Close" @click="reback()">退 出</el-button>
    </div>
    <el-scrollbar :height="h">
      <el-form
        :model="form"
        label-position="right"
        ref="formRef"
        :rules="formRules"
        :class="{ borderNone: disabled }"
        :disabled="disabled"
      >
        <ts-card header="基本信息">
          <el-row :gutter="10">
            <el-col :span="24">
              <div style="display: flex">
                <div
                  style="
                    display: flex;
                    flex-direction: column;
                    margin-right: 5px;
                    margin-bottom: 18px;
                  "
                >
                  <el-form-item
                    label="客户"
                    style="margin-bottom: 5px"
                    required
                  >
                    <ts-select
                      v-if="!disabled"
                      v-model="form.custId"
                      fileName="ChooseCustReport"
                      :template="custTemplate"
                      :mapping="custMapping"
                      :label="form.custName"
                      @updateRow="updateCust"
                    />
                    <span v-else>{{ form.custName }}</span>
                  </el-form-item>
                  <el-input
                    placeholder="客户姓名"
                    v-model="form.custName"
                    type="textarea"
                  ></el-input>
                  <el-input
                    style="margin-top: 5px"
                    placeholder="客户地址"
                    v-model="form.custAddress"
                    type="textarea"
                  ></el-input>
                  <el-input
                    style="margin-top: 5px"
                    placeholder="客户电话"
                    v-model="form.custPhone"
                  ></el-input>
                </div>
                <div
                  style="
                    display: flex;
                    flex-direction: column;
                    margin-right: 5px;
                    margin-bottom: 18px;
                  "
                >
                  <el-form-item
                    style="margin-bottom: 5px"
                    label="销售方"
                    required
                  >
                    <ts-select
                      v-if="!disabled"
                      v-model="form.sellerId"
                      fileName="CompanyReport"
                      :template="sellerTemplate"
                      :mapping="sellerMapping"
                      :label="form.sellerName"
                      @updateRow="updateMore($event, 'seller')"
                    />
                    <span v-else>{{ form.sellerName }}</span>
                  </el-form-item>
                  <el-input
                    placeholder="销售方名称"
                    v-model="form.sellerName"
                    type="textarea"
                  ></el-input>
                  <el-input
                    style="margin-top: 5px"
                    placeholder="销售方地址"
                    v-model="form.sellerAddress"
                    type="textarea"
                  ></el-input>
                  <el-input
                    style="margin-top: 5px"
                    placeholder="销售方电话"
                    v-model="form.sellerPhone"
                  ></el-input>
                </div>
                <div
                  style="
                    display: flex;
                    flex-direction: column;
                    margin-right: 5px;
                    margin-bottom: 18px;
                  "
                >
                  <el-form-item
                    style="margin-bottom: 5px"
                    label="发货人"
                    required
                  >
                    <ts-select
                      v-if="!disabled"
                      v-model="form.shipperId"
                      fileName="CompanyReport"
                      :template="shipperTemplate"
                      :mapping="shipperMapping"
                      :label="form.shipperName"
                      @updateRow="updateMore"
                    />
                    <span v-else>{{ form.shipperName }}</span>
                  </el-form-item>
                  <el-input
                    placeholder="发货人姓名"
                    v-model="form.shipperName"
                    type="textarea"
                  ></el-input>
                  <el-input
                    style="margin-top: 5px"
                    placeholder="发货人地址"
                    v-model="form.shipperAddress"
                    type="textarea"
                  ></el-input>
                  <el-input
                    style="margin-top: 5px"
                    placeholder="发货人电话"
                    v-model="form.shipperPhone"
                  ></el-input>
                </div>
                <div
                  style="
                    display: flex;
                    flex-direction: column;
                    margin-right: 5px;
                    margin-bottom: 18px;
                  "
                >
                  <el-form-item
                    style="margin-bottom: 5px"
                    label="收货人"
                    required
                  >
                    <ts-select
                      v-if="!disabled"
                      v-model="form.consigneeId"
                      fileName="ChooseCustReport"
                      :template="consigneeTemplate"
                      :mapping="consigneeMapping"
                      :label="form.consigneeName"
                      @updateRow="updateMore($event, 'cosignee')"
                    />
                    <span v-else>{{ form.consigneeName }}</span>
                  </el-form-item>
                  <el-input
                    placeholder="收货人姓名"
                    v-model="form.consigneeName"
                    type="textarea"
                  ></el-input>
                  <el-input
                    style="margin-top: 5px"
                    placeholder="收货人地址"
                    v-model="form.consigneeAddress"
                    type="textarea"
                  ></el-input>
                  <el-input
                    style="margin-top: 5px"
                    placeholder="收货人电话"
                    v-model="form.consigneePhone"
                  ></el-input>
                </div>
                <div
                  style="
                    display: flex;
                    flex-direction: column;
                    margin-right: 5px;
                    margin-bottom: 18px;
                  "
                >
                  <el-form-item
                    label="通知人"
                    style="margin-bottom: 5px"
                    required
                  >
                    <ts-select
                      v-if="!disabled"
                      v-model="form.notifierId"
                      fileName="ChooseCustReport"
                      :template="notifierTemplate"
                      :mapping="notifierMapping"
                      :label="form.notifierName"
                      @updateRow="updateMore"
                    />
                    <span v-else>{{ form.notifierName }}</span>
                  </el-form-item>
                  <el-input
                    placeholder="通知人姓名"
                    v-model="form.notifierName"
                    type="textarea"
                  ></el-input>
                  <el-input
                    style="margin-top: 5px"
                    placeholder="通知人地址"
                    v-model="form.notifierAddress"
                    type="textarea"
                  ></el-input>
                  <el-input
                    style="margin-top: 5px"
                    placeholder="通知人电话"
                    v-model="form.notifierPhone"
                  ></el-input>
                </div>
              </div>
            </el-col>
            <el-col :xs="24" :sm="24" :md="24" :lg="6" :xl="6">
              <el-form-item label="合同号" required>
                <el-input v-model="form.number">
                  <template v-if="!disabled && form.custId" #append>
                    <el-button :icon="Refresh" @click="getNumber" />
                  </template>
                </el-input>
              </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="24" :md="24" :lg="6" :xl="6">
              <el-form-item label="销售日期" required>
                <el-date-picker
                  v-model="form.orderDate"
                  value-format="YYYY-MM-DD"
                />
              </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="12" :md="12" :lg="6" :xl="6">
              <el-form-item label="PI No" required>
                <el-input v-model="form.piNo"></el-input>
              </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="24" :md="24" :lg="6" :xl="6">
              <el-form-item label="业务员" required>
                <ts-select
                  v-if="!disabled"
                  v-model="form.salesId"
                  :label="form.salesName"
                  :template="salesTemplate"
                  file-name="ChooseEmployeeReport"
                  @updateRow="updateSales"
                ></ts-select>
                <span v-else>{{ form.salesName }}</span>
              </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="12" :md="12" :lg="6" :xl="6">
              <el-form-item label="银行" required>
                <el-select
                  v-model="form.companyAccountId"
                  clearable
                  placeholder="请选择："
                >
                  <el-option
                    v-for="item in accountList"
                    :key="item.id"
                    :label="item.bankName"
                    :value="item.id"
                  >
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
        </ts-card>
        <ts-card header="订单信息">
          <el-row :gutter="10">
            <el-col :xs="24" :sm="24" :md="24" :lg="6" :xl="6">
              <el-form-item label="起运港" required>
                <el-input v-model="form.loadPort"></el-input>
              </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="12" :md="12" :lg="6" :xl="6">
              <el-form-item label="目的港" required>
                <el-input v-model="form.destinationPort"></el-input>
              </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="12" :md="12" :lg="6" :xl="6">
              <el-form-item label="计划发货日期" required>
                <el-date-picker
                  v-model="form.deliveryTime"
                  value-format="YYYY-MM-DD"
                />
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="10">
            <el-col :xs="24" :sm="24" :md="24" :lg="6" :xl="6">
              <el-form-item label="运输方式">
                <el-select
                  v-model="form.transport"
                  clearable
                  placeholder="请选择："
                >
                  <el-option
                    v-for="item in configData.transportList"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  >
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="24" :md="24" :lg="6" :xl="6">
              <el-form-item label="付款方式">
                <el-input v-model="form.payMethod"></el-input>
              </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="24" :md="24" :lg="6" :xl="6">
              <el-form-item label="币种" required>
                <el-select
                  v-model="form.currencyId"
                  clearable
                  placeholder="请选择："
                >
                  <el-option
                    v-for="item in configData.currencyList"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  >
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="24" :md="24" :lg="6" :xl="6">
              <el-form-item label="贸易条款" required>
                <el-select
                  v-model="form.tradeTerms"
                  clearable
                  placeholder="请选择："
                >
                  <el-option
                    v-for="item in configData.tradeTermsList"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  >
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="10">
            <el-col :xs="24" :sm="24" :md="24" :lg="6" :xl="6">
              <el-form-item label="预估运费(外币)" required>
                <el-input
                  v-model="form.estimatedFreight"
                  type="number"
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="24" :md="24" :lg="6" :xl="6">
              <el-form-item label="预估港杂费(外币)" required>
                <el-input
                  v-model="form.estimatedPortCharges"
                  type="number"
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="24" :md="24" :lg="6" :xl="6">
              <el-form-item label="预估保费(外币)" required>
                <el-input
                  v-model="form.estimatedPremiums"
                  type="number"
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="24" :md="24" :lg="6" :xl="6">
              <el-form-item label="预估汇率" required>
                <el-input v-model="form.exchangeRate" type="number"></el-input>
              </el-form-item>
            </el-col>
          </el-row>
        </ts-card>
        <ts-card header="订单细项">
          <template #header>
            <div style="float: right; margin-right: 5px">
              <el-form-item label="检测信息">
                <el-switch v-model="showInfo"></el-switch>
              </el-form-item>
            </div>
          </template>
          <sc-form-table
            v-model="dataList"
            dragSort
            :addTemplate="addTemplate"
            @delete="rowDelete"
            placeholder="暂无数据"
            rowKey="mtlId"
          >
            <template #tableContent>
              <el-table-column label="订购产品英文名" width="300">
                <template #default="scope">
                  <ts-select
                    v-if="!disabled"
                    multipe
                    :mapping="productMapping"
                    v-model="scope.row.mtlEnName"
                    fileName="ProductReport"
                    :template="productTemplate"
                    @updateRow="mtlChange(scope, $event)"
                    @selectRows="selectAllRow"
                    :init-form="initSelectForm"
                  ></ts-select>
                  <span v-else>{{ scope.row.mtlEnName }}</span>
                </template>
              </el-table-column>
              <el-table-column
                label="订购产品中文名"
                prop="mtlName"
                width="200"
              ></el-table-column>
              <el-table-column
                label="订舱英文名"
                prop="bookingSpaceEnName"
                width="200"
              ></el-table-column>
              <el-table-column
                label="包装规格"
                prop="mtlSpec"
                width="120"
              ></el-table-column>
              <el-table-column
                label="单位"
                prop="mtlUnitName"
                width="80"
              ></el-table-column>
              <el-table-column label="数量" width="120">
                <template #default="scope">
                  <el-input
                    v-model="scope.row.qty"
                    type="number"
                    @change="handlePrice(scope.row)"
                  ></el-input>
                </template>
              </el-table-column>
              <el-table-column label="FOB单价" width="120">
                <template #default="scope">
                  <el-input
                    v-model="scope.row.price"
                    type="number"
                    @change="handlePrice(scope.row)"
                  ></el-input>
                </template>
              </el-table-column>
              <el-table-column label="CIF单价" width="120">
                <template #default="scope">
                  <el-input
                    v-model="scope.row.cifPrice"
                    type="number"
                    @change="handlePrice(scope.row)"
                  ></el-input>
                </template>
              </el-table-column>
              <el-table-column
                label="FOB总价"
                prop="totalAmount"
                width="120"
              ></el-table-column>
              <el-table-column
                label="CIF总价"
                prop="totalCif"
                width="120"
              ></el-table-column>
              <el-table-column label="销售核算单价" width="120">
                <template #default="scope">
                  <el-input
                    v-model="scope.row.standardPrice"
                    type="number"
                  ></el-input>
                </template>
              </el-table-column>
              <el-table-column label="批号" width="200">
                <template #default="scope">
                  <el-input v-model="scope.row.batchNumber"></el-input>
                </template>
              </el-table-column>
              <template v-if="showInfo">
                <el-table-column label="留样要求" width="220">
                  <template #default="scope">
                    <el-select
                      v-model="scope.row.sampleRequire"
                      clearable
                      placeholder="请选择："
                    >
                      <el-option
                        v-for="item in configData.sampleRequireList"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value"
                      >
                      </el-option>
                    </el-select>
                  </template>
                </el-table-column>
                <el-table-column label="留样数量" width="220">
                  <template #default="scope">
                    <el-select
                      v-model="scope.row.sampleQty"
                      clearable
                      placeholder="请选择："
                    >
                      <el-option
                        v-for="item in configData.sampleQtyList"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value"
                      >
                      </el-option>
                    </el-select>
                  </template>
                </el-table-column>

                <el-table-column label="检测样品数量" width="160">
                  <template #default="scope">
                    <el-select
                      v-model="scope.row.testSampleQty"
                      clearable
                      placeholder="请选择："
                    >
                      <el-option
                        v-for="item in configData.testSampleQtyList"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value"
                      >
                      </el-option>
                    </el-select>
                  </template>
                </el-table-column>
                <el-table-column label="样品方式" width="160">
                  <template #default="scope">
                    <el-select
                      v-model="scope.row.sampleStyle"
                      clearable
                      placeholder="请选择："
                    >
                      <el-option
                        v-for="item in configData.sampleStyleList"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value"
                      >
                      </el-option>
                    </el-select>
                  </template>
                </el-table-column>
                <el-table-column label="热储方式" width="160">
                  <template #default="scope">
                    <el-select
                      v-model="scope.row.reservoirStyle"
                      clearable
                      placeholder="请选择："
                      @change="reservoirStyleChange"
                    >
                      <el-option
                        v-for="item in configData.reservoirStyleList"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value"
                      >
                      </el-option>
                    </el-select>
                  </template>
                </el-table-column>
                <el-table-column label="检测方式" width="220">
                  <template #default="scope">
                    <el-select
                      v-model="scope.row.checkStyleId"
                      clearable
                      placeholder="请选择："
                    >
                      <el-option
                        v-for="item in checkStyleList"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value"
                      >
                      </el-option>
                    </el-select>
                  </template>
                </el-table-column>
                <el-table-column label="热储天数">
                  <template #default="scope">
                    <el-input
                      v-model="scope.row.reservoirDay"
                      type="number"
                    ></el-input>
                  </template>
                </el-table-column>
                <el-table-column label="其它检测" width="120">
                  <template #default="scope">
                    <el-input v-model="scope.row.otherTest"></el-input>
                  </template>
                </el-table-column>
                <el-table-column label="出货结果要求" width="220">
                  <template #default="scope">
                    <el-select
                      v-model="scope.row.shipmentResultRequire"
                      clearable
                      placeholder="请选择："
                    >
                      <el-option
                        v-for="item in configData.shipmentResultRequireList"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value"
                      >
                      </el-option>
                    </el-select>
                  </template>
                </el-table-column>
              </template>
            </template>
            <template #append>
              <div style="display: flex; background-color: #fff1d4">
                <div style="display: flex; padding: 8px 0">
                  <div class="sum_footer_unit" style="width: 1010px">合计</div>
                  <div class="sum_footer_unit" style="width: 360px">
                    {{ form.totalQty }}
                  </div>
                  <div class="sum_footer_unit" style="width: 120px">
                    {{ tool.groupSeparator(form.totalAmount) }}
                  </div>
                  <div class="sum_footer_unit" style="width: 120px">
                    {{ tool.groupSeparator(form.totalCif) }}
                  </div>
                </div>
              </div>
            </template>
          </sc-form-table>
        </ts-card>
      </el-form>
    </el-scrollbar>
  </div>
</template>

<script setup>
import { reactive, ref, onMounted, computed, nextTick,watch } from "vue";
import { ElNotification } from "element-plus";
import { useRoute, useRouter } from "vue-router";
import { Refresh, Plus, Close } from "@element-plus/icons-vue";
import Api from "@/api/model/om";
import tsSelect from "@/components/scSelect/index.vue";
import { deepClone } from "@/utils/arr";
import useTabs from "@/utils/useTabs";
import tool from "@/utils/tool";
const emit = defineEmits(["updatetable"]);
const route = useRoute();
const router = useRouter();
const props = defineProps({
  paramsData: {
    type: Object,
    defalut: {},
  },
});
const h = computed(() => {
  let height;
  var iOS = /iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream;
  if (!iOS) {
    height = window.innerHeight;
  } else {
    height = screen.height;
  }
  return height - 150;
});
const salesTemplate = {
  label: "name",
  value: "id",
};
const custTemplate = {
  label: "custName",
  value: "custId",
};
const sellerTemplate = {
  label: "sellerName",
  value: "sellerId",
};
const consigneeTemplate = {
  label: "consigneeName",
  value: "consigneeId",
};
const notifierTemplate = {
  label: "notifierName",
  value: "notifierId",
};
const shipperTemplate = {
  label: "shipperName",
  value: "shipperId",
};
const productTemplate = {
  label: "mtlEnName",
  value: "mtlId",
};
const initSelectForm = computed(() => {
  return {
    custId: form.value.custId,
  };
});
// 添加用户数据的对象
const form = ref({});
const copyForm = ref({});
const disabled = ref(false);
const configData = ref([]);
const formRef = ref();
const formRules = reactive({});
const showInfo = ref(true);
const accountList = ref([])
const dataList = ref([]);
const deleteDataList = ref([]);
const addTemplate = ref({});
const custMapping = [
  { value: "id", label: "custId" },
  { value: "salesId", label: "salesId" },
  { value: "salesName", label: "salesName" },
  { value: "corpAddress", label: "custAddress" },
  { value: "name", label: "custName" },
  { value: "corpPhone", label: "custPhone" },
  { value: "destinationPort", label: "destinationPort" },
  { value: "currencyId", label: "currencyId" },
  { value: "payMethod", label: "payMethod" },
  { value: "transport", label: "transport" },
  { value: "tradeTerms", label: "tradeTerms" },
  { value: "deptId", label: "deptId" },
];
const sellerMapping = [
  { value: "id", label: "sellerId" },
  { value: "name", label: "sellerName" },
  { value: "address", label: "sellerAddress" },
  { value: "contactPhone", label: "sellerPhone" },
];
const consigneeMapping = [
  { value: "id", label: "consigneeId" },
  { value: "name", label: "consigneeName" },
  { value: "corpAddress", label: "consigneeAddress" },
  { value: "corpPhone", label: "consigneePhone" },
];
const notifierMapping = [
  { value: "id", label: "notifierId" },
  { value: "name", label: "notifierName" },
  { value: "corpAddress", label: "notifierAddress" },
  { value: "corpPhone", label: "notifierPhone" },
];
const shipperMapping = [
  { value: "id", label: "shipperId" },
  { value: "name", label: "shipperName" },
  { value: "address", label: "shipperAddress" },
  { value: "contactPhone", label: "shipperPhone" },
];
const productMapping = [
  { value: "id", label: "mtlId" },
  { value: "name", label: "mtlName" },
  { value: "spec", label: "mtlSpec" },
  { value: "englishName", label: "mtlEnName" },
  { value: "bookingSpaceEnName", label: "bookingSpaceEnName" },
  { value: "subUnitId", label: "mtlUnitId" },
  { value: "subUnitName", label: "mtlUnitName" }
];
const checkStyleList = ref([]);
const optType = ref();
watch(dataList,(newValue,oldValue)=>{
  form.value.totalQty = dataList.value.reduce(
    (sum, e) => sum + Number(e.qty || 0),
    0
  );
  form.value.totalAmount =tool.formatRoundNum(
    dataList.value.reduce((sum, e) => sum + Number(e.totalAmount || 0), 0),
    2
  );
  form.value.totalCif = tool.formatRoundNum(
    dataList.value.reduce((sum, e) => sum + Number(e.totalCif || 0), 0),
    2
  );
},{deep:true})
onMounted(() => {
  optType.value = route.query.optType;
  getInit();
});
const getInit = async (val) => {
  if (optType.value === "detail") {
    disabled.value = true;
  }
  let res;
  if (route.query.id || val) {
    let param = val ? val : route.query;
    res = await Api.order.detail.post(param);
  } else {
    res = await Api.order.add.post();
  }
  if (res.code == "200") {
    configData.value = res.configData;
    form.value = deepClone(res.data);
    addTemplate.value = deepClone(res.dtl);
    if(form.value.sellerId){
      getAccount('init')
    }
    if (res.dataList) {
      dataList.value = res.dataList;
    }
    if (optType.value === "add") {
      dataList.value.push(deepClone(addTemplate.value));
    }
    if (optType.value === "copy") {
      console.log(form.value);
      form.value.id = null;
      form.value.number = null;
      dataList.value.forEach((ele) => {
        ele.id = null;
      });
      getNumber();
    }
  }
};
const updateCust = async (val) => {
  copyForm.value = deepClone(form.value);
  form.value = val;
  form.value = Object.assign(deepClone(copyForm.value), form.value);
  form.value.consigneeId = val.custId;
  form.value.consigneeName = val.custName;
  form.value.consigneeAddress = val.custAddress;
  form.value.consigneePhone = val.custPhone;
  form.value.notifierId = val.custId;
  form.value.notifierAddress = val.custAddress;
  form.value.notifierPhone = val.custPhone;
  form.value.notifierName = val.custName;
  dataList.value = []
  dataList.value.push(deepClone(addTemplate.value));
  getNumber();
};
const getNumber = async () => {
  let res = await Api.order.generateOrderNo.post({ id: form.value.custId });

  if (res.code === "200") {
    form.value.number = res.number;
  }
};
const updateMore = (val, type) => {
  copyForm.value = deepClone(form.value);
  form.value = val;
  form.value = Object.assign(deepClone(copyForm.value), form.value);
  if (type === "cosignee") {
    form.value.notifierId = form.value.consigneeId;
    form.value.notifierName = form.value.consigneeName;
    form.value.notifierPhone = form.value.consigneePhone;
    form.value.notifierAddress = form.value.consigneeAddress;
  }
  if(type ==='seller'){
    getAccount('change')
  }
};
const getAccount = async(val)=>{
  let param ={
    fileName:'CompanyAccountReport',
    fieldMap:{
      masterId:form.value.sellerId
    }
   
  }
  console.log(param)
  let res =await Api.order.select.query.post(param)
  if(res.code =='200'){
    if(res.reportData.length>0){
      if(val ==='change' ||(optType.value =='add'&& val ==='init')){
        form.value.companyAccountId = res.reportData[0].id
      }
      accountList.value = res.reportData
    }
   
  }
}
const updateSales = (val) => {
  form.value.deptId = val.deptId;
  form.value.deptName = val.deptName;
  form.value.salesName = val.name;
};
const mtlChange = (scope, val) => {
  console.log(val)
  dataList.value[scope.$index] = Object.assign(
    deepClone(addTemplate.value),
    val
  );
};
const selectAllRow = (val) => {
  val.forEach((ele) => {
    // dataList.value.filter((ele) => {
    //   return ele.mtlId;
    // });
    
    dataList.value.push(Object.assign(deepClone(addTemplate.value), ele));
  });
  dataList.value = dataList.value.filter(ele=>{
    return ele.mtlId!==null
  })
  dataList.value.push(deepClone(addTemplate.value));
  // selectKey.value += 1;
};
const rowDelete = (val) => {
  deleteDataList.value.push(val);
};
const reservoirStyleChange = (val) => {
  checkStyleList.value = configData.value.checkStyleList.filter((ele) => {
    return ele.masterNo === val;
  });
};
const handlePrice = (row) => {
  row.totalAmount = tool.formatRoundNum(row.price * row.qty, 2);
  row.totalCif = tool.formatRoundNum(row.cifPrice * row.qty, 2);
};

const save = async (val) => {
  let param = {
    bean: form.value,
    dataList: dataList.value.filter((ele) => {
      return ele.mtlId;
    }),
  };
  console.log(param);
  let res = await Api.order.save.post(param);
  console.log(res);
  if (res.code == "200") {
    optType.value === "save";
    ElNotification.success({
      title: "",
      message: "添加成功！",
      duration: 2000,
    });
    reback();
    // if (val) {
    //   getInit(false);
    // } else {
    //   getInit({id:res.id});
    // }
  }
};
const update = async () => {
  let param = {
    bean: form.value,
    dataList: dataList.value.concat(deleteDataList.value).filter((ele) => {
      return ele.mtlId;
    }),
  };
  let res = await Api.order.update.post(param);
  if (res.code == "200") {
    ElNotification.success({
      title: "",
      message: "更新成功！",
      duration: 2000,
    });
    reback();
    // getInit({id:res.id});
  }
};
const reback = () => {
  useTabs.close();
  router.push({
    path: "/orderList/OrderReport",
  });
  route.isRefrensh = true;
};
</script>
<style lang="less" scoped>
.buttonGroup {
  align-items: center;
  box-sizing: border-box;
  display: flex;
  height: 48px;
  justify-content: flex-end;
  margin-bottom: 12px;
  padding: 10px 16px;
  font-size: 12px;
  list-style-type: none;
  text-align: left;
  background-color: #ffffff;
}
.borderNone {
  :deep(.el-input__wrapper) {
    box-shadow: 0 0 0 0px var(--el-input-border-color, var(--el-border-color))
      inset;
    cursor: default;
    background-color: transparent; //背景颜色透明
    border-bottom: 1px solid #999;
    border-radius: 0;

    .el-input__inner {
      cursor: default !important;
    }
  }
  :deep(.el-textarea__inner) {
    box-shadow: 0 0 0 0px var(--el-input-border-color, var(--el-border-color))
      inset;
    cursor: default;
    background-color: transparent; //背景颜色透明
    border-bottom: 1px solid #999;
    border-radius: 0;
  }
}
.sum_footer_unit {
  height: 23px;
  line-height: 23px;
  padding: 0 12px;
  font-size: 14px;
  font-weight: 600;
  text-align: left;
}
</style>
